import { BasicColumn } from '@/components/Table';
import { FormSchema } from '@/components/Form';
import { useRender } from '@/hooks/component/useRender';
import { InputNumber, Input } from 'ant-design-vue';
import { VxeGridPropTypes, VxeTablePropTypes } from 'vxe-table';
import { getDictOptions } from '@/utils/dict';
import { DictEnum } from '@/enums/dictEnum';
import { listSaleOrder } from '@/api/sale/order';
import { listCustomer } from '@/api/customer';
const { renderDict } = useRender();
export const formSchems: FormSchema[] = [
  {
    label: '客户名称',
    field: 'customerName',
    component: 'Input',
  },
  {
    label: '创建日期',
    field: 'dateRange',
    component: 'RangePicker',
    colProps: { span: 10 },
    componentProps: {
      placeholder: ['开始日期', '结束日期'],
      format: 'YYYY-MM-DD',
      valueFormat: 'YYYY-MM-DD',
    },
  },
];

export const columns: BasicColumn[] = [
  {
    title: '退款编号#',
    dataIndex: 'id',
    width: 160,
  },
  {
    title: '日期',
    dataIndex: 'refundDate',
  },
  {
    title: '客户',
    dataIndex: 'customerName',
  },
  {
    title: '关联单#',
    dataIndex: 'salesOrderId',
    width: 160,
  },
  {
    title: '订单状态',
    dataIndex: 'status',
    customRender: ({ value }) => {
      return renderDict(value, DictEnum.ORDER_STATUS);
    },
  },
  {
    title: '币种',
    dataIndex: 'currency',
    customRender: ({ value }) => {
      return renderDict(value, DictEnum.CURRENCY);
    },
  },
  {
    title: '金额',
    dataIndex: 'refundAmount',
  },
  // {
  //   title: '待核销金额',
  //   dataIndex: 'salesUserName',
  // },
];

export const drawerSchemas: FormSchema[] = [
  {
    label: '退款编号',
    field: 'id',
    required: false,
    component: 'Input',
    show: false,
  },
  {
    label: '客户',
    field: 'customerId',
    required: true,
    component: 'ApiSelect',
    componentProps: {
      api: listCustomer,
      labelField: 'customerName',
      valueField: 'customerId',
      afterFetch: (res) => {
        return res.rows;
      },
    },
  },
  {
    label: '币种',
    field: 'currency',
    required: false,
    component: 'Select',
    componentProps: {
      allowClear: false,
      options: getDictOptions(DictEnum.CURRENCY),
    },
  },
  {
    label: '日期',
    field: 'refundDate',
    required: true,
    component: 'DatePicker',
    componentProps: {
      format: 'YYYY-MM-DD',
      valueFormat: 'YYYY-MM-DD HH:mm:ss',
    },
  },
  {
    label: '关联单号',
    field: 'salesOrderId',
    required: true,
    component: 'ApiSelect',
    componentProps: {
      api: listSaleOrder,
      labelField: 'id',
      valueField: 'id',
      afterFetch: (res) => {
        return res.rows;
      },
    },
  },
];
export const drawerSchemas3: FormSchema[] = [
  {
    label: '',
    field: 'list',
    required: false,
    slot: 'list',
    itemProps: {
      autoLink: false,
    },
    colProps: { span: 24 },
  },
  {
    label: '产品金额',
    field: 'spuMoney',
    required: false,
    component: 'Input',
    colProps: { span: 8 },
    componentProps: {
      disabled: true,
    },
  },
  {
    label: '其他款项',
    field: 'otherMoney',
    required: false,
    component: 'Input',
    colProps: { span: 8 },
    componentProps: {
      disabled: true,
    },
  },
  {
    label: '总金额',
    field: 'totalAmount',
    required: false,
    component: 'Input',
    colProps: { span: 8 },
    componentProps: {
      disabled: true,
    },
  },
];

export const vxeTableColumns: VxeGridPropTypes.Columns = [
  {
    type: 'checkbox',
    align: 'center',
    width: 60,
  },
  {
    title: '序号',
    type: 'seq',
    fixed: 'left',
    width: '50',
    align: 'center',
  },
  {
    title: '商品名称',
    field: 'name',
    align: 'center',
    slots: {
      edit: ({ row }) => {
        if (row.type === 1) {
          return <Input v-model:value={row.name} placeholder="请输入"></Input>;
        } else {
          return row.name;
        }
      },
    },
    editRender: {},
  },
  {
    title: '商品ID',
    field: 'productId',
    align: 'center',
    visible: false,
  },
  {
    title: '类型',
    field: 'type',
    align: 'center',
    visible: false,
  },
  {
    title: '描述',
    field: 'remark',
    slots: {
      edit: ({ row }) => {
        return <Input v-model:value={row.remark} placeholder="请输入描述"></Input>;
      },
    },
    editRender: {},
  },
  {
    title: '数量',
    field: 'num',
    slots: {
      edit: ({ row }) => {
        return (
          <InputNumber
            v-model:value={row.num}
            min={1}
            max={99999}
            placeholder="请输入数量"
          ></InputNumber>
        );
      },
    },
    editRender: {},
  },
  {
    title: '单价',
    field: 'price',
    slots: {
      edit: ({ row }) => {
        return (
          <InputNumber
            v-model:value={row.price}
            min={1}
            max={99999}
            placeholder="请输入单价"
          ></InputNumber>
        );
      },
    },
    editRender: {},
  },
  {
    title: '合计',
    field: 'amount',
    slots: {
      default: ({ row }) => {
        return row.num * row.price;
      },
    },
  },
];

export const validRules: VxeTablePropTypes.EditRules = {
  num: [{ required: true, message: '请输入数量' }],
  price: [{ required: true, message: '请输入价格' }],
};
export const drawerSchemas4: FormSchema[] = [
  {
    label: '附件',
    field: 'finalPayAmount',
    required: false,
    component: 'InputNumber',
  },
];
export const drawerSchemas5: FormSchema[] = [
  {
    label: '请输入退款原因',
    field: 'remark',
    required: false,
    component: 'InputTextArea',
    componentProps: {
      rows: 3,
    },
  },
];
